<!--
*@Author: zt
*@Description: 论坛新增编辑
*@Date: 2025-03-13
-->
<template>
  <u-dialog v-bind="$attrs" @submit="submitVerify" @close="close">
    <a-layout class="f-h-100 s-bg-white">
      <div>
        <u-wang-editor
          v-model:value="form.content"
          v-model:title="form.title"
          :isLikeTencent="true"
          :fileParams="{
            bucket: 'FORUM',
            biztype: '1',
          }"
        ></u-wang-editor>
      </div>
      <div class="fj-box-style">
        <div class="fj-header-style">添加附件</div>
        <u-form :elements="formEls" :model="form"></u-form>
      </div>
    </a-layout>
    <template #footerBefore>
      <div class="footerBefore-box-style">
        <div class="radio-style">
          <a-checkbox v-model:checked="form.userStatus1">匿名发布</a-checkbox>
        </div>
      </div>
    </template>
  </u-dialog>
</template>

<script lang="ts" setup>
import { ref, reactive, watch, useAttrs } from 'vue';
import { _IFormEl, _IExtra } from '@/components/common/form/interface';
import { FormItemProps } from 'ant-design-vue';
import { messageC } from '@/util/common';

import * as ForumAPI from '@/service/assist/forum/index';

const emits = defineEmits(['submit', 'close']);
// const props = defineProps<{
//   calenderValue?: string;
// }>();
const attrs = useAttrs();

const formItemProps: FormItemProps & _IExtra = {
  labelWidth: '90px',
  colon: false,
};
// 附件表单
const formEls: Array<_IFormEl> = reactive([
  {
    key: 'appendixSaveVOS',
    col: { span: 24 },
    element: 'file',
    formItemProps: { ...formItemProps },
    componentProps: {
      fileParams: { biztype: '2', bucket: 'FORUM' },
    },
  },
]);

const form = ref({
  appendixSaveVOS: [], //附件
  content: '', //轮贴内容
  userStatus1: false, //用户匿名状态
  userStatus: 0, //用户匿名状态传递
  title: '',
  fpostsattachList: [], //附件
});
// 保存验证
const submitVerify = () => {
  let showSubmit = false;
  //标题
  if (form.value.title != '') {
    showSubmit = true;
  } else {
    showSubmit = false;
    return messageC('请填写标题', 'warning');
  }
  // 内容
  if (form.value.content != '') {
    showSubmit = true;
  } else {
    showSubmit = false;
    return messageC('请填写内容', 'warning');
  }

  if (showSubmit) {
    submit();
  }
};

// 保存提交
const submit = async () => {
  if (!attrs.keyid) {
    //新增
    const res = await ForumAPI.fPosts(form.value);
    if (res.code == 0) {
      orginPlForm();
      emits('submit', form.value);
      messageC(res.msg, 'success');
    } else {
      messageC(res.msg, 'error');
    }
  } else {
    // 更新
    const res = await ForumAPI.update(form.value);
    if (res.code == 0) {
      orginPlForm();
      emits('submit', form.value);
      messageC(res.msg, 'success');
    } else {
      messageC(res.msg, 'error');
    }
  }
};

//恢复初始数据
const orginPlForm = () => {
  form.value = {
    appendixSaveVOS: [], //附件
    content: '', //轮贴内容
    userStatus1: false, //用户匿名状态
    userStatus: 0, //用户匿名状态传递
    title: '',
    fpostsattachList: [],
  };
};
const close = () => {
  orginPlForm();
  emits('close');
};

// 数据回显查询
const getSerach = async () => {
  const res = await ForumAPI.getInfo(attrs.keyid);
  if (res.code == 0) {
    form.value = res.data;
    if (form.value.userStatus == 1) {
      form.value.userStatus1 = true;
    }
    if (form.value.fpostsattachList) {
      form.value.appendixSaveVOS = form.value.fpostsattachList;
    }

    // messageC(res.msg, 'success');
  } else {
    messageC(res.msg, 'error');
  }
};

watch(
  () => attrs.open,
  async () => {
    if (attrs.keyid) {
      await getSerach();
    } else {
      orginPlForm();
    }
  }
);
//监听匿名状态
watch(
  () => form.value.userStatus1,
  () => {
    if (form.value.userStatus1) {
      form.value.userStatus = 1;
    } else {
      form.value.userStatus = 0;
    }
  }
);
</script>

<style lang="scss" scoped>
.fj-box-style {
  margin-top: 20px;
  padding-bottom: 20px;
  box-sizing: border-box;
  .fj-header-style {
    font-weight: 400;
    font-size: 16px;
    color: #999999;
    margin-bottom: 20px;
  }
}

.footerBefore-box-style {
  margin-right: calc(100vw - 300px);
}
</style>
